<article class="module width_full">
    <header><h3>{#actions#}</h3></header>
    <table width="100%" cellpadding="3" cellspacing="1">
            <tbody>
                    <tr>
							<th align="center" class="header"><a href="index.php?mod=myprofile&userID={$userID}">{#edit#}</a></th>
                            <th align="center" class="header"><a href="index.php?mod=profile&userID={$userID}">{#profile#}</a></th>
                            <th align="center" class="header"><a href="index.php?mod=profile&page=mails&userID={$userID}">{#mails#}</a></th>
                            <th align="center" class="header"><a href="index.php?mod=profile&page=quests&userID={$userID}">{#quest#}</a></th>
                    </tr>
            </tbody>
    </table>
</article>
<article class="module width_full">
						<div id="tablewrapper">
						<div id="tableheader">
							<div class="search">
								<select id="columns" onchange="sorter.search('query')">
						  <option value="-1">{#columns#}</option>
						  </select>
								<input type="text" id="query" onkeyup="sorter.search('query')" />
							</div>
						<span class="details">
						  <div>{#entries#} <span id="startrecord"></span>-<span id="endrecord"></span> {#from#} <span id="totalrecords"></span></div>
						  <div><a href="javascript:sorter.reset()">{#reset#}</a></div>
						</span>
					  </div>
					<table cellpadding="0" cellspacing="0" id="table" class="tinytable" style="width:100%;" >
						<thead>
							<tr>
								<th><h3>{#name#}</h3></th> 
								<th><h3>{#title#}</h3></th>
							</tr>
						</thead>
						<tbody>
						{if !empty($value)}
						{foreach from=$value item=item}
							<tr>
								<td><a href="index.php?mod=mail&mailID={$item.mailUniqueId}" target="_blank">{$item.name}</a></td>
								<td>{$item.mailTitle}</td>
							</tr>
						{/foreach}
						{else}
							<tr>
								<td>{#nomail#}</td>
								<td></td>
							</tr>
						{/if}
					   </tbody>
					</table>
					  <div id="tablefooter">
						<div id="tablenav">
						  <div>
							<!--<img src="_images/icons/arrow_left.png" alt="First Page" onclick="sorter.move(-1,true)" />&laquo;-->
							<img src="_images/icons/arrow_left.png" alt="First Page" onclick="sorter.move(-1)" />
							<img src="_images/icons/arrow_right.png" alt="First Page" onclick="sorter.move(1)" />
							<!--<img src="_images/icons/arrow_right.png" alt="Last Page" onclick="sorter.move(1,true)" />&raquo;-->
						  </div>
						  <div>
							<select id="pagedropdown"></select>
						  </div>
						  <div class="page">
							<a href="javascript:sorter.showall()">{#see_all#}</a>
						  </div>
						</div>
						<div id="tablelocation">
						  <div>
							<select onchange="sorter.size(this.value)">
							  <option value="5">5</option>
							  <option value="10" selected="selected">10</option>
							  <option value="20">20</option>
							  <option value="50">50</option>
							  <option value="100">100</option>
							</select>
							<span>{#entries_p_site#}</span>
						  </div>
						  <div class="page">{#site#} <span id="currentpage"></span> {#from#} <span id="totalpages"></span></div>
							</div>
						</div>
					</div>
</article>
{literal}
<script>



    var sorter = new TINY.table.sorter('sorter','table',{
      headclass:'head',
      ascclass:'asc',
      descclass:'desc',
      evenclass:'evenrow',
      oddclass:'oddrow',
      evenselclass:'evenselected',
      oddselclass:'oddselected',
      paginate:true,
      size:10,
      colddid:'columns',
      currentid:'currentpage',
      totalid:'totalpages',
      startingrecid:'startrecord',
      endingrecid:'endrecord',
      totalrecid:'totalrecords',
      hoverid:'selectedrow',
      pageddid:'pagedropdown',
      navid:'tablenav',
      sortcolumn:1,
      sortdir:1,
      init:true
    });
    </script>
    {/literal}